
import './style.css'

import React from 'react'
import ReactDOM from 'react-dom'

import Actionsheet from '../src/index.js'

class App extends React.Component {
  constructor(props){
      super(props)
      this.state = {
        show: false
      }
      this.onClick = this.onClick.bind(this)
      this.onRequestClose = this.onRequestClose.bind(this)
  }
  onClick(){
    const { show } = this.state
    this.setState({show: !show})
  }

  onRequestClose(){
    this.onClick()
  }

  render() {
    const { show } = this.state

    const tip = show ? '隐藏' : '显示'
    const menus = [{content: '点我'}, {content: '不要点我'}]

    return (
        <div>
            <button onClick={this.onClick}>{tip}</button>
            <Actionsheet show={show} menus={menus} onRequestClose={this.onRequestClose} />
        </div>
    )
  }
}

window.init = function() {
  ReactDOM.render(<App />, document.querySelector('#app'))
}
